<!DOCTYPE html>
<html>

	<head>
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
		<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta name="format-detection" content="telephone=no">
		<meta name="description" content="">
		<meta http-equiv="x-dns-prefetch-control" content="on">
		<title>创建旅程</title>
		<link rel="stylesheet" href="../imgv2/css/default.min.css" />
		<link href="../imgv2/css/css.css" rel="stylesheet" type="text/css" />
		<link href="../imgv2/icon/iconfont.css" rel="stylesheet" type="text/css" />
		<style>
			body {
				overflow: auto;
			}
			.citylist ul:last-child {
				border-bottom: 0px;
			}
			.citylist ul li {
				white-space: nowrap;
			}
		</style>
	</head>

	<body class="graybg">
		<!--wrap start-->
		<section id="wrap">
			<section class="titlebar">基础信息</section>
			<section class="lh3 citylist whitebg">
				<ul class="listitem bottomline">
					<input type="text" class="inputone" data-column="title" id="txtJourneyTitle" value="请输入旅途主题(必填)">
				</ul>
				<ul class="listitem bottomline">
					<li class="itemcon mtb"><a href="javascript:void(0);" data-column="starttime" id="txtJourneyStartTime">开始时间</a>
					</li>
					<li class="itemarrow mtb"><i class="icon iconfont">&#xe60c;</i>
					</li>
				</ul>
				<ul class="listitem bottomline">
					<li class="itemcon mtb"><a data-column="endtime" href="javascript:void(0);" id="txtJourneyEndTime">结束时间</a>
					</li>
					<li class="itemarrow mtb"><i class="icon iconfont">&#xe60c;</i>
					</li>
				</ul>
			</section>
			<section class="titlebar">目的地</section>
			<section class="lh3 citylist whitebg">
				<ul class="listitem bottomline">
					<li class="itemico mtb"><i class="iconfont">&#xe606;</i>
					</li>
					<li class="itemcon mtb"><a data-column="destination" id="txtJourneyDestination" href="javascript:void(0);">选择目的地</a>
					</li>
					<li class="itemarrow mtb"><i class="iconfont">&#xe60c;</i>
					</li>
				</ul>
				<ul class="listitem bottomline">
					<li class="itemico_g mtb"><i class="iconfont">&#xe60d;</i>
					</li>
					<li class="itemcon_g mtb"><a id="txtJourneyDestinationView" href="javascript:void(0);">地图上预览目的地</a>
					</li>
					<li class="itemarrow mtb"><i class="iconfont">&#xe60c;</i>
					</li>
				</ul>
			</section>
			<section class="citylist">
				<ul class="listitem h60 mt60">
					<button id="btnAddJourney" class="bigbtn button" onClick="this.className='button_d bigbtn'" onmouseout="this.className='bigbtn button'">创建旅程</button>
				</ul>
			</section>
		</section>
		<input type="text" id="friends" data-column="tripleader" style="display: none;" />
		<!--wrap end-->
		<div class="iframe-containter"></div>
	</body>
	<script src="../jsv2/jQuery/jquery-1.11.2.min.js"></script>
	<script src="../jsv2/common.js"></script>
	<script src="../jsv2/input.js"></script>
	<script src="../jsv2/lib/json3.min.js"></script>
	<script src="../jsv2/lib/k-utils-fn.js"></script>
	<script src="../jsv2/lib/fastclick.js"></script>
	<script src="../jsv2/PageValueValidate.js"></script>
	<script src="../jsv2/lib/QueryStringParser.js"></script>
	<script src="../jsv2/jQuery/jquery.json.min.js"></script>
	<script src="../jsv2/jsonMsg.js"></script>
	<script src="../jsv2/journey/operateData.js"></script>
	<script>
		var iframeWin, $txtJourneyDestination, journey, openId, tripId, isedit = 0; //使用iframe嵌套调用的页面对象
		$(function() {
			openId = queryString.getParam("openid") || '';
			isedit = queryString.getParam("isedit") || 0;
			tripId = queryString.getParam("tripid") || '';
			if (tripId.indexOf("#") > -1) {
				tripId = tripId.replace("#", "");
			}
			if (isedit) {
				getJourney(tripId, function(data, status, xhr) {
					initJourneyInfo(data.portalResp.Data);
				});
				$('#btnAddJourney').html('确认修改');
			}
			//时间选择
			$('#txtJourneyStartTime,#txtJourneyEndTime').on('click', function(e) {
				var tar = $(e.target),
					type = tar.attr('id');
				setIframeSrc('date.html?type=' + type);
			});
			$txtJourneyDestination = $('#txtJourneyDestination');
			$txtJourneyDestination.on('click', function() {
				setIframeSrc('select_dect.html');
			});
			$('#btnAddJourney').on('click', function() {
				var newJourney = {
						openid: openId,
						tripId: tripId,
						title: $('#txtJourneyTitle').val(),
						starttime: $('#txtJourneyStartTime').html(),
						endtime: $('#txtJourneyEndTime').html(),
						destination: getGEOCenter(),
						TripLeader: $('#friends').val()
					}
					//校验数据
				if (checkData(newJourney)) {
					isedit ? editData(newJourney) : saveData(newJourney);
				}
			}); //选中地址后才能预览地址
			$('#txtJourneyDestinationView').on('click', function() {
				if (getGEOCenter()) {
					setIframeSrc('mapView.html');
				}
			});
		});

		function checkData(data) {
				if (!data.destination) {
					alert("请先确定目的地！");
					return false;
				}
				/*if (String(latLon).indexOf(",") < 0) {
					alert("请先确定目的地！");
					return false;
				}*/
				if (!validField("txtJourneyTitle", "旅途主题", 20))
					return false;
				if (!data.starttime) {
					alert("请选择开始时间.");
					return false;
				}
				if (!data.endtime) {
					alert("请选择结束时间.");
					return false;
				}
				/*if (!validField("city", "城市", 30))
					return false;

				if (!validField("keyword", "目的地", 50))
					return false;
					*/
				return true;
			}
			/**
			 * 获取选中的地址
			 */

		function getGEOCenter() {
			return $txtJourneyDestination.data('address');
		}
	</script>

</html>